<template>
  <div class="upload">
    <a-upload v-bind="uploadProps" @update:file-list="updateFileList"></a-upload>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, toRefs, onMounted, computed, type PropType} from 'vue'
import type {FileItem} from '@arco-design/web-vue'

let emits=defineEmits(['update:modelValue'])
let props=defineProps({
    modelValue:{
        type:Array as PropType<FileItem[]>,
        default:()=>[]
    },
    accept:{
        type:String,
        default:""
    },
    action:{
        type:String,
        default:""
    },
    headers:{
        type:Object,
        default:()=>{}
    },
    data:{
        type:Object,
        default:()=>{}
    },
   multiple:{
    type:Boolean,
    default:true
   },
   limit:{
    type:Number,
    default:0
   }
})
let uploadProps=computed(()=>{
  return {
    fileList:props.modelValue,
    action:props.action,
    headers:props.headers,
    data:props.data,
    multiple:props.multiple,
    limit:props.limit,
  }
})

function updateFileList(fileList){
  emits('update:modelValue',fileList)
}
</script>
<style scoped lang="less">
.upload{
  width: 100%;
  height: 100%;
}
</style>